import React, { useState } from "react";
import { CommonModal } from "@/views/components/CommonModal";
import { Form, message, Radio, Button, Row, Col } from "antd";
import { batchSnycStock } from "../service";
// 商品备注仅对自发订单生效

function StockSyncModal(props) {
	const { checkedIds, syncStatus, onCancel } = props;
	const [syncType, setSyncType] = useState(1);
	const onChange = e => {
		setSyncType(e.target.value);
	};
	async function handleOk() {
		// isSyncInventory 是否同步库存：1,开启；0，关闭
		// syncType 同步类型：1,可用；2,虚拟
		const API_DATA = { ids: checkedIds, isSyncInventory: 1, syncType: syncType };
		const { success, msg, data } = await batchSnycStock(API_DATA);
		if (success) {
			message.success(`操作完成，更新${data}条数据`);
			onCancel();
			fetchList();
		}
	}

	return (
		<CommonModal
			title={{ title: "提示" }}
			open={true}
			width="450px"
			// onOk={handleOk}
			onCancel={onCancel}
			footer={
				<Row justify="space-between" style={{ alignItems: "center" }}>
					<Col className="common-color11">
						<span style={{ lineHeight: "18px", display: "inline-block" }}>
							当前勾选生效商品数：
							<span className="common-color9" style={{ lineHeight: "18px", display: "inline-block" }}>
								{checkedIds.length}
							</span>
						</span>
					</Col>
					<Col>
						<Button size="middle" key="back" onClick={onCancel}>
							取消
						</Button>
						<Button size="middle" key="save" type="primary" onClick={handleOk}>
							确定
						</Button>
					</Col>
				</Row>
			}
		>
			<span style={{ lineHeight: "20.5px", display: "inline-block" }}>
				请选择需要同步的库存，每次库存同步的链接数请勿超过100条，否则将影响自动库存同步的时效。 更改库存类型，请谨慎操作
			</span>
			{syncStatus === 1 && (
				<Radio.Group onChange={onChange} value={syncType} style={{ marginTop: 16 }}>
					<Radio value={1}>
						<span style={{ lineHeight: "21px", display: "inline-block" }}>可用库存</span>
					</Radio>
					<Radio value={2}>
						<span style={{ lineHeight: "21px", display: "inline-block" }}>虚拟库存</span>
					</Radio>
				</Radio.Group>
			)}
			<div style={{ height: 24 }}></div>
		</CommonModal>
	);
}

export default StockSyncModal;
